<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>购买</title>
    <meta name="viewport" content="width=device-width, initial-scale=0.5, maximum-scale=0.5, minimum-scale=0.5, user-scalable=0">
    <!-- 电话号码不被显示为超链接 -->
    <meta content="telephone=no" name="format-detection" />
    <meta http-equiv="Pragma" content="no-cache">
    <meta http-equiv="Cache-Control" content="no-cache">
    <meta http-equiv="Expires" content="0">
    <!-- UC强制全屏 -->
    <meta name="full-screen" content="yes">
    <!-- QQ强制全屏 -->
    <meta name="x5-fullscreen" content="true">
    <link rel="stylesheet" href="./static/css/animate.css">
    <link rel="stylesheet" href="./static/css/com.css">
    <link rel="stylesheet" href="./static/css/submit-order.css">

</head>

<body>
    <div id='app'>

        <hea-controll :icon_json='heaIconJson' @right1='right1' @right2='right2'></hea-controll>

        <!-- 寄件人/收件人信息弹窗 -->
        <send-people-info ref='sendOrGet' :send_font='sendPeoFont' @sendaddressinfo='peoInfo'></send-people-info>
        <!-- 寄件人/收件人信息弹窗 -->

        <!-- 取消订单弹窗 -->
        <gou-out-controll ref='closeOrderEl' :go_out_data='goOut' @sure='sureCloseOrder'></gou-out-controll>
        <!-- 取消订单弹窗 -->

        <!-- 微信支付回来弹窗是否已经支付 -->
        <gou-out-controll ref='surePay' :go_out_data='surePayFont' @sure='surePay'></gou-out-controll>
        <!-- 微信支付回来弹窗是否已经支付 -->

        <!-- 优惠卷内容 -->
        <div id='mask' style='z-index:102' v-if='offVoucher' @click='offVoucher=false;'></div>
        <transition enter-active-class='animated fadeInUp' leave-active-class='animated fadeOutDown'>
            <div class='voucher-wrap' v-if='offVoucher'>
                <h1>优惠卷</h1>
                <div class='voucher-list' v-for="(val,index) in 10" :key='index'>
                    <div>
                        <p>满1000送120</p>
                    </div>
                    <!-- 到时这里选择的卷的img是 yes.png  通过voucherInfo的use来判断-->
                    <img src="./static/img/no.png" width="35px">
                </div>
            </div>
        </transition>

        <!-- 优惠卷内容 -->

        <!-- 中间内容 -->
        <div class='goods-submit-wrap'>
            <transition enter-active-class='animated zoomIn' leave-active-class='animated zoomOutDown'>
                <div class='address' v-if='!offSendMothd' @click='addGetPeo("get")'>
                    <div class='have-address' v-if='true'>
                        <div>
                            <div>
                                <img src="./static/img/icon-user.png" width="18px" height="18px">
                                <span>收货人：</span>
                            </div>
                            <span>王一一</span>
                        </div>
                        <div style="padding:12px 0;">
                            <div>
                                <img src="./static/img/icon-phone.png" width="18px" height="18px">
                                <span>联系电话：</span>
                            </div>
                            <span>1998751252454</span>
                        </div>
                        <div>
                            <div>
                                <img src="./static/img/icon-address.png" width="18px" height="25px">
                                <span>收货地址：</span>
                            </div>
                            <span>上帝就发卡斯sdfasdFjdklsdjhklf斯达克警方看了介绍的分厘卡机迪克的身份金克拉方法</span>
                        </div>
                    </div>
                    <div v-else style="height:40px;font-size:24px;line-height: 40px;">
                        请添加收件人信息
                    </div>
                    <img src="./static/img/icon-left.png" width="14px" height="24px">
                </div>
            </transition>
            <div class='img-goods-info'>
                <img src="./static/img/6beb88f29af490b47d51a353fe6c26b5.jpeg" width="200px">
                <div class='order-intro-right'>
                    <h1>县规划局规划局看县规划局规划局看县规划局看县规划局规划局看县规划局看县规划局规划局看县规划局规划局看</h1>
                    <p>
                        <span>单价：￥</span>
                        <span>1234.00</span>
                    </p>
                    <p>
                        <span>购买数量：*</span>
                        <span>123</span>
                    </p>
                    <p>
                        <span>总价：￥</span>
                        <span>123.00</span>
                    </p>
                </div>
            </div>
            <div class='leav-mesg'>
                <textarea placeholder="亲，如有特殊要求请留言"></textarea>
            </div>
            <div class='other-order-info'>
                <div class='other-controll' @click='offVoucher=true;'>
                    <span>优惠券</span>
                    <span class='breen-font' v-if='false'>-120 满1000送120</span>
                    <img v-else src="./static/img/icon-left.png" width="14px" height="24px">
                </div>
                <div class='other-controll'>
                    <span>积分抵扣</span>
                    <span v-if='true' class='breen-font'>-120 满1000送120</span>
                    <img v-else src="./static/img/icon-left.png" width="15px">
                </div>
                <div class='other-controll'>
                    <span>配送方式</span>
                    <div class='send-method breen-font'>
                        <span @click='offSendMothd=true' style="margin-right:10px;"><input type="radio" name='method' checked> <span>自取</span></span>
                        <span @click='offSendMothd=false'><input type="radio" name='method'> <span>快递</span> </span>
                    </div>
                </div>
                <transition enter-active-class='animated zoomIn' leave-active-class='animated zoomOutDown'>
                    <div class='introduce-info' v-if='offSendMothd'>
                        <p><span>花圃名：</span><span>花迦</span></p>
                        <p><span>联系方式：</span><span>1887502454</span></p>
                        <p><span>花圃地址：</span><span>重庆是稍等哈速度很快方法</span></p>
                    </div>
                </transition>

                <div class='other-controll'>
                    <span>配送时间</span>
                    <span class='breen-font'>明天24点前到达，请注意查收</span>
                </div>
                <div class='other-controll' @click='addGetPeo("send")'>
                    <span>寄件人</span>
                    <img src="./static/img/icon-left.png" width="15px">
                </div>
                <div class='introduce-info'>
                    <p><span>姓名：</span><span>世界</span></p>
                    <p><span>手机号：</span><span>1887502454</span></p>
                    <p><span>地址信息：</span><span>重庆是稍等哈速度很快方法</span></p>
                </div>
            </div>
        </div>
        <!-- 中间内容 -->

        <!-- 底部操作 -->
        <div class='bottom-controll-wrap'>
            <div class='bottom-left'>
                <span>全额：</span>
                <span>￥<span>1200.00</span></span>
            </div>
            <div class='bottom-right'>
                <button @click='$refs.closeOrderEl.offShow=true;'>取消订单</button>
                <button @click='goPay'>微信支付</button>
            </div>
        </div>
        <!-- 底部操作 -->

    </div>
    <script src="./static/js/com.js"></script>
    <script src="./static/js/jquery-3.3.1.min.js"></script>
    <script src='./static/layer_mobile/layer.js'></script>
    <script src='./static/js/vue.min.js'></script>
    <script src="./component/com/header.js"></script>
    <script src="./component/com/sendPeoInfo.js"></script>
    <script src="./component/com/goOut.js"></script>
    <script src="./static/js/vue-service-submit-order.js"></script>
</body>

</html>